<template>
	<view class="container">
		<view class="logo">
			<image src="http://wx.xiongmaovip.com/miniapp/static/wash.jpg" mode=""></image>
			<view class="wash-type">
				<view class="name">
					<!-- 标准洗车 -->
				</view>
				<view class="price">
					{{isShow?'核销成功':'洗车券'}}
				</view>
			</view>
		</view>
		<view class="discount">
			<view class="title" v-if="!isShow">
				优惠方式
			</view>
			<view class="item">
				<view class="left">
					{{isShow?'核销时间':'优惠券名称'}}
				</view>
				<view class="right">
					{{isShow? fungetCurrentTime() :washMap.couponName}}
				</view>
			</view>
		</view>
		<view class="memo">
			<view>
				注意:
			</view>
			<view>
				1、请确认以案作均已完成:熄火、拉手刹、收视镜关车窗、关雨刷、收天线:
			</view>
			<view>
				2、为避免造成损失，，禁止以下车辆洗车:
			</view>
			<view>
				带突起车标、警示灯、尾翼、备胎等车辆、改装车、皮卡车或表面破损车辆。
			</view>
		</view>
		<view class="submit" v-if="!isShow && !flag">
			<view class="exit" @click="exit()">
				返回
			</view>
			<view class="confirm" @click="confirm">
				马上核销
			</view>
		</view>
		<view class="return" @click="exit()" v-if="isShow || flag">
			返回
		</view>
	</view>
</template>

<script>
	import {
		getWashCoupon,
		useWashCoupon,
		getCode,
		createMemberInfo
	} from '@/api/index.js'
	import {
		toast,
		fungetCurrentTime
	} from '../../../utils/common';
	export default {
		data() {
			return {
				washMap: {},
				isShow: false,
				flag: false,
				stationId: ''
			};
		},
		onLoad(option) {
			this.stationId = decodeURIComponent(option.q).split('=')[1]
			uni.setStorageSync('isCode', 1)
			getCode().then(res => {
				createMemberInfo({
					openId: res.openid
				}).then(res => {
					if (res.memberId) {
						this.getWash()
						return
					}
					toast('您还不是会员，请先注册')
					let time = setTimeout(() => {
						uni.reLaunch({
							url: '/pages/login/index'
						})
						clearTimeout(time)
					}, 1000)

				})
			})
		},
		methods: {
			fungetCurrentTime,
			getWash() {
				getWashCoupon({}).then(res => {
					if (res.couponId) {
						this.washMap = res
						return
					}
					toast('该会员没有洗车券')
					this.flag = true
				})
			},
			confirm() {
				uni.showLoading({
					title: '核销中...'
				})
				useWashCoupon({
					stationId: this.stationId,
					couponId: this.washMap.couponId //'10000002'
				}).then(res => {
					if (res.code === 200) {
						setTimeout(() => {
							uni.hideLoading()
							this.isShow = true
						}, 1500)
					}
				}).catch(err => {
					toast(err)
				})
			},
			//返回
			exit() {
				uni.reLaunch({
					url: '/pages/index/index'
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.container {
		padding: 100rpx 0rpx 0rpx 0rpx;

		// position: relative;
		.logo {
			text-align: center;

			image {
				border-radius: 50%;
				width: 300rpx;
				height: 300rpx;
			}

			.wash-type {
				.name {
					font-size: 36rpx;
				}

				.price {
					font-size: 46rpx;
					font-weight: 600;
				}
			}
		}

		.discount {
			margin-top: 40rpx;
			background-color: white;
			padding: 0px 30rpx;

			.title {
				font-weight: 600;
				// line-height: 50rpx;
				padding: 20rpx 0rpx;
			}

			.item {
				padding: 20rpx 0rpx;
				display: flex;
				justify-content: space-between;

				.left {}

				.right {}
			}
		}

		.memo {
			padding: 40rpx 30rpx;
			color: red;
			margin-bottom: 20rpx;
			font-size: 28rpx;
		}

		.submit {
			display: flex;
			padding: 20rpx 30rpx;
			justify-content: space-between;

			.exit {
				background-color: chocolate;
				line-height: 80rpx;
				color: white;
				padding: 0rpx 50rpx;
				border-radius: 32rpx;
			}

			.confirm {
				background-color: chocolate;
				line-height: 80rpx;
				color: white;
				padding: 0rpx 50rpx;
				border-radius: 32rpx;
			}
		}

		.return {
			text-align: center;
			width: 80%;
			background-color: chocolate;
			line-height: 90rpx;
			color: white;
			margin: auto;
			border-radius: 26rpx;
		}
	}
</style>